<style>
	.changepassword_page { width: 100%; height: 500px; display: flex; flex-flow: column nowrap; justify-content: center; align-items: center; }
	.changepassword_page input { width: 300px; height: 32px; margin-top: 20px; }
	.changepassword_page button { width: 120px; height: 32px; margin-top: 20px; }
</style>

<section class="changepassword_page" id="vm">
	<input type="password" name="oldpassword" v-model="oldpassword" placeholder="请输入旧密码">
	<input type="password" name="password" v-model="password" placeholder="请输入新密码">
	<input type="password" name="password2" v-model="password2" placeholder="请再次输入新密码">
	<button class="btn_change" @click="changepassword()">变更</button>	
</section>


<script>
	var vm = new Vue({
		el: '#vm',
		data: {
			oldpassword: '',
			password: '', 
			password2: ''
		},
		methods: {
			changepassword: function(){
				let that = this
				if( ! this.oldpassword || ! this.password || ! this.password2){
					alert("请输入旧密码和将要使用的新密码");
					return false;
				}
				if(this.password != this.password2){
					alert("两次输入新密码不一致");
					return false;
				}
				// 首先从数据库获取旧密码
				let userlogin = JSON.parse(sessionStorage.getItem('userlogin')) 

				if(hex_md5(this.oldpassword) == userlogin.password){
					console.log('oldpasswork is right')
					post(dataDomain + 'data/exec.php/ksap/login/changepassword', {user_id: userlogin.user_id, password: hex_md5(this.password)}, function(r){
						console.log(r)
						if(r.data == 1){
							alert("密码已更新")
							window.sessionStorage.removeItem("userlogin")
							window.location.reload()
						} else {
							alert("更新密码失败")
						}
					})	
				} else {
					alert("输入的旧密码不正确，请重新输入" )
				}
			}
		}
	})
	

</script>